<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
request.setAttribute("contextPath",request.getContextPath());
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<style type="text/css">
		.name{
			color:blue;
		}
		
		h3{	
			color:red;
			position:relative;
			margin-top:0;
			margin-left:450;
		}
		
		h4{
			color:orange;
			position:absolute;
			top:7;
			left:20;
		}
		
		.logout{
			position:absolute;
			top:30;
			left:1200;
		}
		
		.managementMenu	{
			position:absolute;
			top:100px;
			left:40px;
		}
		
		.detailManagementMenu{
			position:relative;
			margin-left:30px;
			color:pink;
			display:none;
		}
		.content{
			position:absolute;
			top:100;
			left:200;
			width:1100;
			height:500;
			background-color:#ffffff;
			border-style:solid;
			border-color:#66CD00; 
			border-width:2px;
		}
		.hide{
			display:none;
		}
		
		.realContent1{
			position:relative;
			margin-top:0;
			margin-left:300;
		}
		
		.realContent2{
			position:relative;
			margin-top:0;
			margin-left:220;
		}
		
		.realContent3{
			position:relative;
			margin-top:0;
			margin-left:280;
		}
		
		.realContent4{
			position:relative;
			margin-top:0;
			margin-left:280;
		}
		
		.realContent5{
			position:relative;
			margin-top:0;
			margin-left:220;
		}
		.realContent6{
			position:relative;
			margin-top:0;
			margin-left:300;
		}
		.realContent7{
			position:relative;
			margin-top:0;
			margin-left:300;
		}
	</style>
	<script type="text/javascript" src="${contextPath}/js/jquery-1.7.2.js"></script>
	<script type="text/javascript" src="${contextPath}/js/handlebars-v2.0.0.js"></script>
	<script id="membersTpl" type="text/x-handlebars-template">
		<div>
			<h3>用户列表</h3>
			<div class="realContent2">
			<table border="1">
	 				<tr>
	 					<th>id</th>
						<th>用户名</th>
						<th>昵称</th>
						<th>账户余额</th>
						<th>是否可用</th>
						<th>可用操作</th>
	 				<tr>
	   				{{#each members}}
	   				<tr>
						<td>{{this.id}}</td>
						<td>{{this.username}}</td>
						<td>{{this.nickname}}</td>
						<td>{{this.wealth}}</td>
						<td id="{{this.id}}">{{status this.nonlocked}}</td>
						<td><a class="{{actionClass this.nonlocked}}" id="{{this.id}}" href="">{{action this.nonlocked}}</a></td>
	   				</tr>
	   				 {{/each}}
	   		</table>
			</div>
		</div>
	</script>
	<script id="adminsTpl" type="text/x-handlebars-template">
		<div>
			<h3>管理员列表</h3>
			<div class="realContent5">
			<table border="1">
	 				<tr>
	 					<th>id</th>
						<th>用户名</th>
						<th>密码</th>
						<th>姓名</th>
						<th>角色</th>
						<th>权限</th>
						<th>是否可用</th>
						<th>可用操作</th>
	 				<tr>
	   				{{#each admins}}
	   				<tr>
						<td>{{this.id}}</td>
						<td>{{this.username}}</td>
						<td>{{this.password}}</td>
						<td>{{this.nickname}}</td>
						<td>
							{{#each this.roles}}
							<span>{{role this.name}}</span>
							{{/each}}
						</td>
						<td>
							{{#each this.roles}}
								{{#each this.authorities}}
									<span>{{authority this.name}}</span>
								{{/each}}	
							{{/each}}
						</td>						
						<td id="{{this.id}}">{{status this.nonlocked}}</td>
						<td><a class="{{actionClass this.nonlocked}}" id="{{this.id}}" href="">{{action this.nonlocked}}</a></td>
	   				</tr>
	   				{{/each}}
	   		</table>
			</div>
		</div>
	</script>
	
	<script id="booktypesTpl" type="text/x-handlebars-template">
		<option value=""></option>
		{{#each booktypes}}
			<option value="{{this.id}}">{{this.name}}</option>
		{{/each}}	
	</script>						
	
	<script id="booksTpl" type="text/x-handlebars-template">
		<div>
			<h3>书籍列表</h3>
			<div class="realContent8">
			<table border="1">
	 				<tr>
	 					<th>书籍id</th>
						<th>书籍名称</th>
						<th>书籍类型</th>
						<th>进价</th>
						<th>售价</th>
						<th>作者</th>
						<th>出版社  </th>
						<th>出版时间</th>
						<th>出售状态</th>
						<th>销量</th>
						<th>库存量</th>
						<th>编辑</th>
	 				<tr>
	   				{{#each books}}
	   				<tr>
						<td>{{this.id}}</td>
						<td>{{this.name}}</td>
						<td>{{this.booktype}}</td>
						<td>{{this.}}</td>
						<td>{{this.id}}</td>
						<td>{{this.id}}</td>
						<td>{{this.id}}</td>
						<td>{{this.id}}</td>
						<td>{{this.id}}</td>
						<td>{{this.id}}</td>
						<td>{{this.id}}</td>
						<td>{{this.id}}</td>
	   				</tr>
	   				 {{/each}}
	   		</table>
			</div>
		</div>
	</script>
	
	
	<script type="text/javascript">
		$(document).ready(function(){
			registerHelpers();
			var $memberManagementMenu = $("#memberManagementMenu");
			var $adminManagementMenu = $("#adminManagementMenu");
			var $bookManagementMenu = $("#bookManagementMenu");
			var $orderManagementMenu = $("#orderManagementMenu");
		
			$("#orderManagementA").click(function(){
				$.ajax({
					url: "${contextPath}/order/manageOrder",
					type:"POST",
					success:function(o){
						if(o!=null && o.result) {
				 			$orderManagementMenu.toggle();
	          			}else{
	          				alert("没有权限");
	          			}
					},
					error:function(o){
						alert("error");
					}
				});
				return false;
			});
			$("#memberManagementA").click(function(){
				$.ajax({
					url: "${contextPath}/user/manageMember",
					type:"POST",
					success:function(o){
						if(o!=null && o.result) {
				 			$memberManagementMenu.toggle();
	          			}else{
	          				alert("没有权限");
	          			}
					},
					error:function(o){
						alert("error");
					}
				});
				return false;
			});
			
			$("#adminManagementA").click(function(){
				$.ajax({
					url: "${contextPath}/user/manageAdmin",
					type:"POST",
					success:function(o){
						if(o!=null && o.result) {
							$adminManagementMenu.toggle();
	          			}else{
	          				alert("没有权限");
	          			}
					},
					error:function(o){
						alert("error");
					}
				});
				return false;
			});
			
			$("#bookManagementA").click(function(){
				$.ajax({
					url: "${contextPath}/book/manageGoods",
					type:"POST",
					success:function(o){
						if(o!=null && o.result) {
							$bookManagementMenu.toggle();
	          			}else{
	          				alert("没有权限");
	          			}
					},
					error:function(o){
						alert("error");
					}
				});
				return false;
			});	
			$("#findMemberA").click(function(){
				$("#content").html($("#findMember").html());
				
				$("#memberUsername").focus(function(){
					$("#findMemberTip").text("");
				});	
				
				$("#findMemberButton").click(function(){
					var memberUsername = $("#memberUsername").val();
					if(memberUsername == ""){
						$("#findMemberTip").css("color","red");
						$("#findMemberTip").text("请输入用户名");
						return;
					}
					$.ajax({
						url: "${contextPath}/user/findMember/"+memberUsername+"/",
						type:"POST",
						success:function(o){
							if(o!=null && o.members != null) {
					 			var source = $("#membersTpl").html();
	            				var template = Handlebars.compile(source);
	            				var html = template(o);
	           					$("#content").html(html);
	           					handleNonlockA("Member");
	           				}else{
	           					$("#findMemberTip").css("color","red");
								$("#findMemberTip").text("未找到用户");
	           				}
						},
						error:function(o){
							alert("error");
						}
					});
				});
				return false;		
			});		
			
		
						
			$("#listMembersA").click(function(){
				$.ajax({
					url: "${contextPath}/user/listMembers/1",
					type:"POST",
					success:function(o){
				 		if(o!=null && o.members != null) {
				 			var source = $("#membersTpl").html();
            				var template = Handlebars.compile(source);
            				var html = template(o);
           					$("#content").html(html);
           					handleNonlockA("Member");
				 		}else{
				 			alert("fail");
				  		}
					},
					error:function(o){
						alert("error");
					}
				});	
				return false;
			});
			
			
			$("#findAdminA").click(function(){
				$("#content").html($("#findAdmin").html());
				
				$("#adminUsername").focus(function(){
					$("#findAdminTip").text("");
				});	
				
				$("#findAdminButton").click(function(){
					var adminUsername = $("#adminUsername").val();
					if(adminUsername == ""){
						$("#findAdminTip").css("color","red");
						$("#findAdminTip").text("请输入管理员用户名");
						return;
					}
					$.ajax({
						url: "${contextPath}/user/findAdmin/"+adminUsername+"/",
						type:"POST",
						success:function(o){
							if(o!=null && o.admins != null) {
					 			var source = $("#adminsTpl").html();
	            				var template = Handlebars.compile(source);
	            				var html = template(o);
	           					$("#content").html(html);
	           					handleNonlockA("Admin");
	           				}else{
	           					$("#findAdminTip").css("color","red");
								$("#findAdminTip").text("未找到管理员");
	           				}
						},
						error:function(o){
							alert("error");
						}
					});
				});		
				return false;
			});		
			
			
			$("#addAdminA").click(function(){
				 $("#content").html($("#addAdmin").html());
				 var $username = $("#username");
				 var $usernameTip = $("#usernameTip");
			     var $password = $("#password");
			     var $passwordTip = $("#passwordTip");
			     var $nickname = $("#nickname");
			     var $nicknameTip =$("#nicknameTip");
			     var usernameStandard = /^[\w_]+$/;
			     var nameStandard = /^[\u0391-\uFFE5]{1,5}$/;
			     var $roleTip = $("#roleTip");
				 $username.focus(function (){
					 $usernameTip.css("color","gray");
					 $usernameTip.text("字母、数字、或_组成");
				 });	
				 
				 $username.blur(function(){
					var username = $("#username").val();
					if(username == ""){
						$usernameTip.text("");
						return;
					}
					if(!usernameStandard.test(username)){
						$usernameTip.css("color","red");
						$usernameTip.text("用户名格式有误,请重新输入");
						return;
					}	
					$.ajax({
						url:"${contextPath}/user/checkUsername/"+username+"/",
						type:"POST",
						success:function(o){
							  if(o && o.result) {
								  $usernameTip.css("color","#99CC00");
								  $usernameTip.text("√");
							  }else{
								  $usernameTip.css("color","red");
								  $usernameTip.text("此用户名已被注册");
							  }
						},
						error:function(o){
							alert("error");
						}
					});	
				});
				
				$password.keyup(function(){
					var password = $password.val();
					if(password.length == 0){
						$passwordTip.text("");
						return;
					}
					if(password.length<6||password.length>15){
						$passwordTip.css("color","red");
						$passwordTip.text("密码长度应6-15");
						return;
					}
					$passwordTip.css("color","#99CC00");
					$passwordTip.text("√");
				});
				
				$password.focus(function(){
					var password = $password.val();	
					if(password == ""){
						$passwordTip.text("");
					}
				});
				
				$nickname.focus(function (){
					$nicknameTip.css("color","gray");
					$nicknameTip.text("中文名,不大于5字");
				});	
				
				$nickname.blur(function(){
					var nickname = $("#nickname").val();
					if(nickname == ""){
						$nicknameTip.text("");
						return;
					}
					if(!nameStandard.test(nickname)){
						$nicknameTip.css("color","red");
						$nicknameTip.text("姓名格式有误,请重新输入");
						return;
					}
					$nicknameTip.css("color","#99CC00");
					$nicknameTip.text("√");	
				});
				
				$(".role").focus(function(){
					$roleTip.css("color","gray");
					$roleTip.text("指定1-3个不同角色");
				});
				
				$(".role").blur(function(){
					$roleTip.text("");
				});
				
				$("#addAdminSubmitButton").click(function(){
					if($usernameTip.text() != "√"){
						$usernameTip.css("color","red");
						$usernameTip.text("请正确填写用户名");
					} 
					if($passwordTip.text() != "√"){
						$passwordTip.css("color","red");
						$passwordTip.text("请正确填写密码");
					} 
					if($nicknameTip.text() != "√"){
						$nicknameTip.css("color","red");
						$nicknameTip.text("请正确填写姓名");
					} 
					if($("#role1").val() == "" && $("#role2").val() == "" && $("#role3").val() == ""){
						$roleTip.css("color","red");
						$roleTip.text("请指定至少一个角色");
						return;
					}
					
					if($usernameTip.text() == "√" && $passwordTip.text() == "√" && $nicknameTip.text() == "√"){
						var roles = new Array();
						$("select").each(function(){
							var value = "'"+$(this).val()+"'"; 
							if(value == "'ADM_MEMBER'" || value == "'ADM_GOODS'" || value == "'ADM_ORDER'"){
								roles.push(value);
							}
						});
						
						var admin = "{'username':'"+$username.val()+"','password':'"+$password.val()+"','nickname':'"+$nickname.val()+"','roles':["
						+roles+"]}";
						
						$.ajax({
							url: "${contextPath}/user/addAdmin",
							data:{"admin":admin},
							type:"POST",
							success:function(o){
				 				if(o!=null && o.result !=false){
				 					alert("添加成功");
				 					$username.val("");
				 					$password.val("");
				 					$nickname.val("");
				 					$usernameTip.text("");
				 					$passwordTip.text("");
				 					$nicknameTip.text("");
				 				}else{
				 					alert("添加失败");
				 				}
							},
							error:function(o){
								alert("error");
							}
						});	
					}
				
				});
				return false;
			});
			

			$("#listAdminsA").click(function(){
				$.ajax({
					url: "${contextPath}/user/listAdmins/1",
					type:"POST",
					success:function(o){
				 		if(o!=null && o.admins != null) {
				 			var source = $("#adminsTpl").html();
            				var template = Handlebars.compile(source);
            				var html = template(o);
           					$("#content").html(html);
           					handleNonlockA("Admin");
				 		}else{
				 			alert("fail");
				  		}
					},
					error:function(o){
						alert("error");
					}
				});	
				return false;
			});	
			
			
			$("#addBooktypeA").click(function(){
				$("#content").html($("#addBooktype").html());
				
				$("#booktypeName").focus(function(){
					$("#addBooktypeTip").text("");
				});	
				
				$("#booktypeName").blur(function(){
					if($("#booktypeName").val() == ""){	
						return;
					}
					$.ajax({
						url:"${contextPath}/book/checkBooktype/"+$("#booktypeName").val(),
						type:"POST",
						success:function(o){
							if(o!=null && o.result == true) {
					 			$("#addBooktypeTip").css("color","#99CC00");
								$("#addBooktypeTip").text("√");
	           				}else{
	           					$("#addBooktypeTip").css("color","red");
								$("#addBooktypeTip").text("已存在该类别");
	           				}
						},
						error:function(o){
							alert("error");
						}
					});	
					return false;
				});
				
				$("#addBooktypeSubmitButton").click(function(){
					if($("#addBooktypeTip").text() != "√"){
						if($("#addBooktypeTip").text()=="已存在该类别"){
							return;
						}
						$("#addBooktypeTip").css("color","red");
						$("#addBooktypeTip").text("请正确输入类别名称");
						return;
					}
					$.ajax({
						url: "${contextPath}/book/addBooktype/"+$("#booktypeName").val(),
						type:"POST",
						success:function(o){
							if(o!=null && o.result == true) {
								$("#addBooktypeTip").text("");
					 			$("#booktypeName").val(""); 
					 			alert("添加成功");
	           				}else{
	           					alert("添加失败");
	           				}
						},
						error:function(o){
							alert("error");
						}
					});
				});		
				
				return false;
			});
			
			
			$("#addBookA").click(function(){
				$.ajax({
						url:"${contextPath}/book/listBooktypes",
						type:"POST",
						success:function(o){
							if(o!=null && o.booktypes != null) {
									var source = $("#booktypesTpl").html();
            						var template = Handlebars.compile(source);
            						var html = template(o);
           							$("#typeId").html(html);
           							
           							
	           				}
						},
						error:function(o){
							alert("error");
						}
				});
				$("#content").html($("#addBook").html());
				
				$("#addBookSubmitButton").click(function(){
				
						
						var book = "{'name':'"+$("#bookName").val()+"','typeId':'"+$("#typeId").val()+"','inPrice':'"+$("#inPrice").val()+"','outPrice':'"
						+$("#outPrice").val()+"','author':'"+$("#author").val()+"','press':'"+$("#press").val()+"','publishTime':'"+$("#publishTime").val()+"','storageVolume':'"+$("#storageVolume").val()
						+"','onsaleFlag':'"+$("input:radio[name='onsale']:checked").val()+"','description':'"+$("#description").val()+"'}";
						
						$.ajax({
							url: "${contextPath}/book/addBook",
							data:{"book":book},
							type:"POST",
							success:function(o){
				 				if(o!=null && o.result !=false){
				 					alert("添加成功");
				 					$("#bookName").val("");
				 					$("#typeId").val("");
				 					$("#inPrice").val("");
				 					$("#author").val("");
				 					$("#outPrice").val("");
				 					$("#press").val("");
				 					$("#publishTime").val("");
				 					$("#storageVolume").val("");
				 					$("#description").val("");
				 				}else{
				 					alert("添加失败");
				 				}
							},
							error:function(o){
								alert("error");
							}
						});	
					
				
				});	
				return false;
			});
			
			
			
			
			
			
			
			function handleNonlockA(moa){
				$(".lock,.unlock").click(function(){
           			var $this = $(this);
       				$.ajax({
						url: "${contextPath}/user/"+$this.attr("class")+moa+"/"+$(this).attr("id"),
						type:"POST",
						success:function(o){
								if(o!=null && o.result) {
									var tdId = $this.attr("id");
								 	if($this.attr("class") == "lock"){
										$this.attr("class","unlock");
										$this.html("解封");
										$("td#"+tdId).text("不可用");
									}else{
										$this.attr("class","lock");
										$this.html("封禁");
										$("td#"+tdId).text("可用");
									}
								}
						},
						error:function(o){
							alert("error");
						}
					});
					return false;	
       			}); 	
			}
		});	
		
		function registerHelpers(){
            Handlebars.registerHelper('status', function(nonlocked) {
                if(nonlocked){
                	return "可用";
                }
                return "不可用";
            });
            
            Handlebars.registerHelper('action', function(nonlocked) {
                if(nonlocked){
                	return "封禁";
                }
                return "解封";
            });
            
            Handlebars.registerHelper('actionClass', function(nonlocked) {
                if(nonlocked){
                	return "lock";
                }
                return "unlock";
            });
            
            Handlebars.registerHelper('role', function(name) {
                if(name == "ADM_MEMBER"){
                	return "用户管理员";
                }
                if(name == "ADM_GOODS"){
                	return "商品管理员";
                }
                if(name == "ADM_ORDER"){
                	return "订单管理员";
                }
				return name; 
            });
            
            Handlebars.registerHelper('authority', function(name) {
                if(name == "MEMBER_MANAGE"){
                	return "用户管理";
                }
                if(name == "GOODS_MANAGE"){
                	return "商品管理";
                }
                if(name == "ORDER_MANAGE"){
                	return "订单管理";
                }
				return name; 
            });
        }
        
        
	</script>
 </head>
  
  <body>	
  	<div>
   		<h4><span id="name" class="name">${name},</span>欢 迎 来 到 慧 驾 书 城 管 理 员 后 台!</h4>
   		<a id="logoutA" class="logout" href="logout">退出</a> 
   		<div id="managementMenu" class="managementMenu">
   			
   			<div>
   				<a  id="adminManagementA" href="">管理员管理</a>
   			</div>	
   			
   			<div id="adminManagementMenu" class="detailManagementMenu">
   				<div>
   					<a id="addAdminA" href=""><font color="pink">添加管理员</font></a>
   				</div>
   				<div>
   					<a id="findAdminA" href=""><font color="pink">查找管理员</font></a>
   				</div>
   				<div>
   					<a id="listAdminsA" href=""><font color="pink">管理员列表</font></a>
   				</div>	
   			</div>
   			
   			<div>
   				<a id="memberManagementA" href="">普通用户管理</a>
   			</div>
   			
   			<div id="memberManagementMenu" class="detailManagementMenu">
   				<div>
   					<a id="findMemberA" href=""><font color="pink">查找用户</font></a>
   				</div>
   				<div>
   					<a id="listMembersA" href=""><font color="pink">用户列表</font></a>
   				</div>
   			</div>
   			
   			
   			
   			<div>
   				<a id="bookManagementA" href="">商品管理</a>
   			</div>
   			
   			<div id="bookManagementMenu" class="detailManagementMenu">
   				<div>
   					<a id="addBooktypeA" href=""><font color="pink">添加类别</font></a>
   				</div>
   				<div>
   					<a id="addBookA" href=""><font color="pink">添加书籍</font></a>
   				</div>
   				<div>
   					<a id="findBookA" href="book/findBooks"><font color="pink">查找书籍</font></a>
   				</div>
   			</div>
   			
   			<div>
   				<a id="orderManagementA" href="">订单管理</a>
   			</div>
   			
   			<div id="orderManagementMenu" class="detailManagementMenu">
   				<div>
   					<a  href="order/listOrders"><font color="pink">订单处理</font></a>
   				</div>
   			</div>	
   		</div>
   		<div id="content" class="content">
	 		
   		</div>
   		
   		<div id="findMember" class="hide">
   			<h3>查找用户</h3>
   			<div class="realContent1">
   			请输入用户名:<input id="memberUsername" style="width:200px"><input id="findMemberButton" type="button" value="查找"><span id="findMemberTip"></span>	
   			</div>
   		</div>
   		
   		<div id="findAdmin" class="hide">
   			<h3>查找管理员</h3>
   			<div class="realContent3">
   			请输入管理员用户名:<input id="adminUsername" style="width:200px"><input id="findAdminButton" type="button" value="查找"><span id="findAdminTip"></span>	
   			</div>
   		</div>	 	   		
   		
   		<div id="addAdmin" class="hide">
   			<h3>添加管理员</h3>
   			<div class="realContent4">
   			<table border="1">
				<tr>
					<th>用户名</th><td><input id="username"/></td><td id="usernameTip" width="200"></td>
				</tr>
				<tr>
					<th>密码</th><td><input type="password" id="password"/></td><td id="passwordTip"></td>
				</tr>	
				<tr>
					<th>姓名</th><td><input id="nickname"/></td><td id="nicknameTip" width="200"></td>
				</tr>	
				<tr>
					<th>角色1</th>
					<td>       
						<select id="role1"  class="role">
								<option value=""></option>
								<option value ="ADM_MEMBER">用户管理员</option>
  						</select>
					</td>
					<td id="roleTip" width="200"></td>
				</tr>
				<tr>
					<th>角色2</th>
					<td>       
						<select id="role2"  class="role">
								<option value=""></option>		
  								<option value ="ADM_GOODS">商品管理员</option>
  						</select>
					</td>
				</tr>
				<tr>
					<th>角色3</th>
					<td>       
						<select id="role3"  class="role">
								<option value=""></option>
  								<option value="ADM_ORDER">订单管理员</option>
  						</select>
					</td>
				</tr>
				<tr>
					<td>
						<input id="addAdminSubmitButton" type="button" value="提交" />
					</td>	
				</tr>	
   			</table>
   			</div>
   		</div>
   	
   		<div id="addBooktype" class="hide">
   			<h3>添加类别</h3>
   			<div class="realContent6">
   			请输入类别名称:<input id="booktypeName" style="width:200px"><span id="addBooktypeTip"></span>
   					  <br>
   					  <input id="addBooktypeSubmitButton" type="button" value="添加">	
   			</div>
   		</div>
   		
   		<div id="addBook" class="hide">
   			<h3>添加书籍</h3>
   			<div class="realContent7">
   			<table border="1">
				<tr>
					<th>书籍名称</th><td><input id="bookName" style="width:200px"></td><td id="bookNameTip" width="200"></td>
				</tr>
				<tr>
					<th>书籍类别</th>
					<td>
						<select id="typeId">
							
  						</select>
  					</td>
				</tr>
				<tr>
					<th>进价</th><td><input id="inPrice" style="width:200px"></td><td id="inPriceTip" width="200"></td>
				</tr>
				<tr>
					<th>售价</th><td><input id="outPrice" style="width:200px"></td><td id="outPriceTip" width="200"></td>
				</tr>
				<tr>
					<th>作者</th><td><input id="author" style="width:200px"></td><td id="authorTip" width="200"></td>
				</tr>
				
				<tr>
					<th>出版社</th><td><input id="press" style="width:200px"></td><td id="pressTip" width="200"></td>
				</tr>
				<tr>
					<th>出版时间</th><td><input id="publishTime" style="width:200px"></td><td id="publishTimeTip" width="200"></td>
				</tr>	
				<tr>
					<th>库存量</th><td><input id="storageVolume" style="width:200px"></td><td id="storageVolumeTip" width="200"></td>
				</tr>	
				<tr>
					<th>是否上架</th>
					<td>
						<input type="radio" id="onSale" name="onsale" value="true" />是
						<input type="radio" id="onSale" name="onsale" value="false" />否
					</td>
					<td id="outPriceTip" width="200"></td>
				</tr>	
				<tr>
					<th>描述</th><td><input id="description" style="width:200px"></td><td id="description" width="200"></td>
				</tr>						
   				<tr>
   					<td><input id="addBookSubmitButton" type="button" value="添加"></td>
   				</tr>	
   			</table>		
   			</div>
   		</div>
   		
   	</div>

  </body>
</html>
